<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>
    <?php echo $titlename ?>
    </title>
    <link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/4.1.0/css/bootstrap.min.css">
  <script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
  <script src="https://cdn.bootcss.com/popper.js/1.12.5/umd/popper.min.js"></script>
  <script src="https://cdn.bootcss.com/bootstrap/4.1.0/js/bootstrap.min.js"></script>
</head>
<body>

<nav class="navbar navbar-expand-sm bg-dark navbar-dark">
  <ul class="navbar-nav">
  <li class="nav-item ">
      <a  class="nav-link" href ="index.php?c=Users&a=home"><?php echo ($this->username . "的任务");?> </a>
    </li>
    <li class="nav-item">
      <a  class="nav-link" href ="index.php?c=Tasks&a=all">所有任务</a>
    </li>
    <li class="nav-item active">
    <a class="nav-link" href ="index.php?c=Tasks&a=progress">项目进度</a>
    </li>
    <li class="nav-item">
    <a  class="nav-link" href ="index.php?c=Tasks&a=input">发布任务</a>
    </li>
    <li class="nav-item">
    <a class="nav-link" href ="index.php?c=Users&a=logOut">注销</a>
    </li>
  </ul>
</nav>  


<div class="container" style="margin-top: 30px">
<div class="row">
<!-- <div class="col-2"></div> -->
<div class="col-12">
<!-- <div class="row">
<div class="col-8"> -->
  <h2><?php echo ($titlename . "<br>");?> </h2>
  <span class="badge badge-success"><?php echo ($this->username);?></span>
  <span class="badge badge-warning">其他人</span>
  <span class="badge badge-danger">剩余任务</span>
<!-- </div>
</div> -->
  <div class="progress" style="margin-top:20px;height:50px;font-size:15px" >

    <div class="progress-bar bg-success progress-bar-striped progress-bar-animated" style="width:<?php echo($myDone)?>">
    <?php echo ($this->username);?>
    </div>

    <div class="progress-bar bg-warning progress-bar-striped progress-bar-animated" style="width:<?php echo($otherDone)?>">
      其他人
    </div>

    <div class="progress-bar bg-danger progress-bar-striped progress-bar-animated" style="width:<?php echo($notDonePresent)?>">
      剩余任务 <?php echo ($notDone);?> 个
    </div>

  </div>
</div>
</div>
</div>

</body>

<script>
/**
 * 循环插入元素
 */
<?php 
// foreach ($userDone as $key => $value) {
  ?>
  // var para = document.createElement("p");
  // var node = document.createTextNode("
  <?php  
  // echo($key . ":" .$value) 
  ?>
  // ");
  // para.appendChild(node);
  // var element = document.getElementById("progress");
  // element.appendChild(para);
  <?php
// } 
 ?>


</script>
</html>